<template>
  <view class="disFlx py-10 px-16 fz-14" :style="{ ...color }">
    <text class="ali-icon icon-tips mr-8 fz-16"></text>
    <text>{{ text }}</text>
  </view>
</template>

<script setup lang="ts">
  import { propTypes } from '@/utils/propTypes';
  import type { PropType, CSSProperties } from 'vue';

  defineProps({
    text: propTypes.string,
    color: {
      type: Object as PropType<{ backgroundColor: string; color: string }>,
      default: () => ({
        backgroundColor: '#fff4e7',
        color: '#e29942',
      }),
    },
    styles: Object as PropType<CSSProperties>
  });
</script>
